export default {
    data() {
        return {
            request: {},
            queryParam: {},
            resetQueryParam: {},
            queryFormItemLayout: {
                labelCol: {
                    xs: {span: 24},
                    sm: {span: 5}
                },
                wrapperCol: {
                    xs: {span: 24},
                    sm: {span: 16}
                }
            },
            formItemLayout: {
                labelCol: {
                    xs: {span: 24},
                    sm: {span: 6}
                },
                wrapperCol: {
                    xs: {span: 24},
                    sm: {span: 14}
                }
            },
            columns: [],
            tableData: [],
            tableLoading: false,

            tableRowKey: 'id',
            pagination: {
                position: 'bottom',
                pageSizeOptions: [10, 20, 30, 40, 50],
                pageSize: 10,
                current: 1,
                total: 0,
                showTotal: total => `共${total} 条数据`,
                showQuickJumper: true,
                showSizeChanger: true
            },
            selectedRowKeys: [],
            rowSelection: null,
            // rowSelection: {
            //     fixed: true,
            //     selectedRowKeys: [],
            //     onChange: this.onSelectChange
            // },
            // 弹窗1
            modalLoading: {
                loading1: false,
                loading2: false,
                loading3: false,
            },
            modalTitle: {
                title1: '',
                title2: '',
                title3: '',
            },
            modalShow: {
                show1: false,
                show2: false,
                show3: false,
            },
            modalResetForm: {
                ruleForm1: {},
                ruleForm2: {}
            },
            modalForm: {
                ruleForm1: {},
                ruleForm2: {}
            },
            modalRules: {
                rules1: {},
                rules2: {}
            }

        }
    },
    created() {
        this.init()
    },
    methods: {
        init() {
            this.onSearch()
        },
        onSearch() {
            this.pagination.current = 1
            this.getPage()
        },
        onReset() {
            this.queryParam = {
                ...this.resetQueryParam
            }
            this.onSearch()
        },
        getPage() {
            if (!this.request.page) return
            this.tableLoading = true
            this.request.page({
                ...this.queryParam,
                pageNo: this.pagination.current,
                pageSize: this.pagination.pageSize
            }).then(res => {
                this.tableLoading = false
                this.tableData = res.records
                this.pagination.total = res.total || 0
                this.formattData(this.tableData)
            }).catch(() => {
                this.tableLoading = false
            })
        },
        formattData() {
        },
        handleChange(pagination) {
            this.pagination.current = pagination.current
            this.pagination.pageSize = pagination.pageSize
            this.getPage()
        },
        onSelectChange(selectedRowKeys, selectedRows) {
            this.selectedRowKeys = selectedRowKeys
        },
        handleAdd() {
            this.modalForm.ruleForm1 = {
                ...this.modalResetForm.ruleForm1
            }
            this.modalTitle.title1 = '新建'
            this.modalShow.show1 = true
        },
        handleEdit(rowItem) {
            for (const key in this.modalForm.ruleForm1) {
                this.modalForm.ruleForm1[key] = rowItem[key]
            }
            this.modalTitle.title1 = '修改'
            this.modalShow.show1 = true
        },
        handleDelete(rowItem, params) {
            return this.request.delete(rowItem.id, params).then(res => {
                this.$message.success('删除成功')
                this.onSearch()
            })
        },
        handleConfirm() {
            this.modalLoading.loading1 = true
            if (this.modalForm.ruleForm1.id) {
                this.request.update(JSON.parse(JSON.stringify(this.modalForm.ruleForm1))).then(res => {
                    this.$message.success('修改成功')
                    this.getPage()
                    this.modalShow.show1 = false
                    this.modalLoading.loading1 = false
                }).catch(() => {
                    this.modalLoading.loading1 = false
                })
            } else {
                this.request.create(JSON.parse(JSON.stringify(this.modalForm.ruleForm1))).then(res => {
                    this.$message.success('新增成功')
                    this.onSearch()
                    this.modalShow.show1 = false
                    this.modalLoading.loading1 = false
                }).catch(() => {
                    this.modalLoading.loading1 = false
                })
            }
        },
        onValidate(name = 'ruleForm1') {
            if (this.$refs[name]) {
                this.$nextTick(() => {
                    this.$refs[name].clearValidate()
                })
            }
        },
        handleCancel(name = 'ruleForm1') {
            this.modalShow.show1 = false
            if (this.$refs[name]) {
                this.$nextTick(() => {
                    this.$refs[name].clearValidate()
                })
            }
        }

    }
}
